<template>
  <el-card class="box-card">
    <div class="clearfix poemTitle flex-col al-left">
      <span >{{title}}</span>
      <el-divider></el-divider>

    </div>
    <div class="flex-col al-left" v-html="content">
    </div>
  </el-card>

</template>

<script>
export default {
  name: "FeaturedItem",
  computed:{
    title(){
      return this.$store.state.featured.title
    },
    content(){
      return this.$store.state.featured.content
    },
  }
}
</script>

<style lang="scss" scoped>
.box-card {
  text-align: left;
}

.poemTitle {
  font-size: x-large;
}

.author {
  font-size: medium;
  margin-bottom: 10px;
}


</style>